<template>
	<view>
		<view class="top">
			<view class="dad">
				<view class="crown">
					<img src="../../static/psx/积分.png" alt="">
					<span>{{data.jifen}}</span>
				</view>
			</view>
			<view class="continuity">
				<p>连续签到{{data.day}}天</p>
			</view>
			<view class="more">
				<p>签到越多 奖励越丰富</p>
			</view>
		</view>
		<view class="body">
			<view v-show="this.data.code == 0" class="content" @click="up">
				<img src="../../static/psx/签到.png" alt="">
			</view>
			<view v-show='this.data.code == 1' class="content">
				<img src="../../static/psx/555.png" alt="">
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				cont: 30,
				show: true,
				qiand: false,
				jifen: 1060,
				// d: new Date().getTime(),
				// a: new Date(new Date().toLocaleDateString()).getTime(),
				data: []
			}
		},
		onLoad() {
			this.$api.getpsxdata().then(res => {
				this.data = res.data[0]
				// console.log(this.data)
			})

		},
		methods: {
			// setTimeout(up(),this.d-this.a),
			up() {
				let data = {
					id: this.data.id,
					jifen: Number(this.data.jifen) + 5,
					day: Number(this.data.day) + 1,
					code: 1
				}
				this.$api.upPsxdata(data).then(res => {
					console.log(res);
					this.$api.getpsxdata().then(res => {
						this.data = res.data[0]
						
						console.log(this.data)
					})
					this.psx()
				})
			},
			psx() {
				var a=new Date().getTime()
				var b= new Date(new Date().toLocaleDateString()).getTime()
				var c=a-b
				console.log(c)
				setTimeout(() => {
					let data = {
						id: this.data.id,
						code: 0
					}
					this.$api.upPsxdata(data).then(res => {
						console.log(res);
						this.$api.getpsxdata().then(res => {
							this.data = res.data[0]
							console.log(this.data)
						})

					})
				},c)
			}
		}
	}
</script>

<style scoped>
	.top {
		width: 100%;
		height: 350upx;
		border-bottom: 1px solid gainsboro;
	}

	.dad {
		width: 100%;
		display: flex;
		justify-content: space-evenly;
	}

	.crown {
		width: 250upx;
		height: 100upx;
		margin-top: 40upx;
		justify-content: space-evenly;
		display: flex;
		align-items: center
	}

	.crown img {
		width: 60upx;
		height: 60upx
	}

	.crown span {
		font-size: 50upx;
		font-weight: 500;
		color: #90C132;
	}

	.continuity {
		width: 400upx;
		height: 70upx;
		border-radius: 50upx;
		border: 1px solid #90C132;
		margin: 0 auto;
		color: #90C132;
		text-align: center;
		line-height: 70upx;
		font-size: 36upx;
		margin-top: 30upx;
	}

	.more {
		margin: 0 auto;
		font-size: 24upx;
		color: darkgray;
		text-align: center;
		margin-top: 40upx;
	}

	.content {
		width: 600upx;
		height: 600upx;
		margin: 100upx auto;
	}

	.content img {
		width: 600upx;
		height: 600upx;
	}
</style>
